<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>arguments</title>
</head>
<style>
  p {
    font-size: 12px;
  }
  .red {
    color: red;
  }
</style>
<body>

  <p>1. 函数参数的默认值是undefined , 如果你希望使用参数的默认值，请一定传undefined，而不是null</p>
  <h4>二. arguments</h4>
  <p>1. 函数的实际参数会被保存在一个类数组对象<span class="red">arguments</span>中。</p>
  <p>2. arguments也是一个和严格模式有关联的对象。</p>

  <button id="clickBtn">点击按钮</button>

  
</body>

<script>
  let btn = document.getElementById('clickBtn');

  btn.onclick = function() {
    console.log('点击事件')
  }

</script>

<script>
  // arguments对象 函数自带属性， 是函数的参数
  // 1. 获取函数实参的数量
  // argLength = arguments.length
  // 例
  function add(a, b) {
    // console.log(arguments.length, '想要获取某个参数'+ arguments[0])
    var argLength = arguments.length
    return argLength
  }
  add(1,2,3)  // 3  arguments的length由实参的数量决定, 而不是形参


  // 2. arguments也是一个和严格模式有关联的对象。
  // 2.1 在非严格模式下，arguments里的元素和函数参数都是指向同一个值的引用，对arguments的修改，会直接影响函数参数。
  // 2.2 在严格模式下，arguments是函数参数的副本，对arguments的修改不会影响函数参数。但是arguments不能重新被赋值
  // 例
  function test(obj) {
    arguments[0] = "我改变了函数的参数， 把对象改为字符串了"
    console.log(obj)
    return obj
  }

  // 直接返回的是修改过后的参数
  test({name: "张三"}) //"我改变了函数的参数， 把对象改为字符串了"
</script>
</html>